import allLayouts from "@/components/graph/config/layout.js";
import emitter from "@/utils/emitter.js";
import {behaviorsConfig} from './dynamicsConfig'

function options(params) {
    const layout = allLayouts[params.layout]
    const padding = params.padding || [20, 20, 20, 20]
    const animation = params.animation || false
    const defaultNodeSize = params.defaultNodeSize || 40
    const nodeLabelSize = params.defaultLabelSize || 16
    const defaultNodeFill = params.defaultNodeFill || '#6865cb'
    const autoFit = params.defaultFitView || 'center'
    let behaviors = behaviorsConfig(params)
    return {
        layout,
        padding,
        animation,
        autoFit,
        behaviors,
        autoResize: true,
        zoom: 1,
        node: {
            type: (d) => d?.data?.type || 'circle',
            style: {
                src: (d) => d?.data?.src,
                size: (d) => d?.style?.size || defaultNodeSize,
                labelFontSize: (d) => d?.style?.labelFontSize || nodeLabelSize,
                fill: (d) => d?.style?.fill || defaultNodeFill,
                labelFill: (d) => d?.style?.labelFill || '#343434',
                halo: false,
                haloLineWidth: 1,
                haloStroke: 'rgba(255,255,255,0.8)',
                haloVisibility: 'hidden',
                labelTextAlign: 'middle',
                labelBackground: false,
                labelBackgroundFill: 'rgba(0,0,0,0.15)',
                labelBackgroundRadius: 5,
                labelMaxWidth: '400%',
                labelMaxLines: 2,
                labelWordWrap: true,
                ports: [],
                lineWidth: 0,
                stroke: 'rgba(255,255,255,1)',
                fillOpacity: 1,
                labelPlacement: 'bottom',
                labelOffsetY: 4,
                shadowBlur: 10,
                shadowType: "outer",
                shadowColor: 'rgba(0,0,0,0.5)',
                // iconWidth: 50,
                // iconHeight: 50,
                // iconSrc: 'https://img2.baidu.com/it/u=3856718872,2979774853&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=502',
                // iconRadius: 50
            },
            state: {
                selected: {
                    halo: true,
                    lineWidth: 0,
                    labelFontSize: (d) => d?.style?.labelFontSize || nodeLabelSize,
                    labelFontWeight: 'normal',
                    fillOpacity: 1,
                },
                unselected: {
                    fillOpacity: 0.2,
                    strokeOpacity: 0.2,
                    labelOpacity: 0.2,
                },
                highlight: {
                    opacity: 1,
                    halo: true,
                    lineWidth: 0,
                    labelFontSize: (d) => d?.style?.labelFontSize || nodeLabelSize,
                    labelFontWeight: 'normal'
                },
                active: {
                    halo: true,
                    opacity: 1,
                    lineWidth: 0,
                    labelFontSize: (d) => d?.style?.labelFontSize || nodeLabelSize,
                    labelFontWeight: 'normal'
                },
                inactive: {
                    halo: false,
                    opacity: 1,
                    lineWidth: 0,
                    fill: 'rgba(208,208,208,0.2)',
                    labelFontSize: (d) => d?.style?.labelFontSize || nodeLabelSize,
                    labelFontWeight: 'normal'
                },
                customUnSelected: {
                    opacity: 1
                }
            },
            palette: {
                type: 'group',
                field: 'nodeType',
                color: ['#5a98d9', '#76a1c7', '#9590e0', '#9eb293', '#bd8c88', '#abaa7e', '#82a2a2']
            }
        },
        edge: {
            type: 'line',
            style: {
                labelFill: "#3b3b3b",
                stroke: "rgba(199,225,246,0.8)",
                lineWidth: 2,
                endArrow: true,
                labelFontSize: 14,
                labelBackground: true,
                labelBackgroundFill: '#7eeaea',
                labelBackgroundStroke: '#7eeaea',
                labelBackgroundLineWidth: 1,
                labelBackgroundRadius: 4,
                labelBackgroundOpacity: 0.5,
                labelPadding: [1, 2],
            },
            state: {
                selected: {
                    fillOpacity: 1,
                    opacity: 1,
                },
                unselected: {
                    fillOpacity: 0.2,
                    strokeOpacity: 0.2,
                    labelOpacity: 0.2
                },
            }
        },
        plugins: [
            {
                type: 'contextmenu',
                trigger: 'contextmenu',
                onClick: (key, dom, elementData) => {
                    if (elementData) {
                        const data = {key, dom, elementData}
                        emitter.emit('showAttributePanel', data)
                    } else {
                        console.log("元素不存在")
                    }
                },
                getItems: () => {
                    return [
                        {name: '删除元素', value: 'delete'},
                        {name: '编辑属性', value: 'edit'},
                    ];
                },
                enable: (e) => e.targetType === 'node',
            },
            {
                key: 'grid-line',
                type: 'grid-line',
                follow: false
            },
            {
                type: "fullscreen"
            },
            {
                type: 'legend',
                nodeField: 'nodeType',
                gridRow: 1,
                gridCol: 6,
                width: 100,
                height: 20,
                itemSpacing: 15,
                colPadding: 15,
                position: "bottom",
                itemLabelFontSize: 20,
                itemMarkerSize: 20,
            }
        ]
    }
}

export default options
